<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>

<body>
    <div class="container">
        <div class="row message_row">
            <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 message_left">
                <p><span class="glyphicon glyphicon-envelope"></span> &nbsp; 消息中心</p>
                <div class="message_left_down">
                    <a href="#invite" class="message_left_a">邀请消息</a>
                    <a href="#reply" class="message_left_a">回复消息</a>
                </div>
            </div>
            <div class="col-lg-10 col-md-10 col-sm-10 col-xs-10">
                <div id="invite">
                    <div class="message_top">邀请消息</div>
                    <table class="table table-striped message_down">
                        <thead>
                            <tr>
                                <th>消息</th>
                                <th style="width: 50%;">操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {volist name="request_list" id="r"}
                            <tr>
                                <td>{$r.usr_name}邀请你加入“{$r.prj_name}”项目</td>

                                <td><button onclick="window.location.href='{:url('index/joinPrjResponse',array('flag'=>'Y','prjId'=>$r.id))}'">同意加入</button>
                                    <button class="button" style="margin-left: 20px;" onclick="window.location.href='{:url('index/joinPrjResponse',array('flag'=>'R','prjId'=>$r.id))}'">拒绝加入</button>
                                </td>

                            </tr>
                            {/volist}
                        </tbody>
                    </table>
                </div>
                <div id="reply">
                    <div class="message_top">回复消息</div>
                    <table class="table table-striped message_down">
                        <thead>
                            <tr>
                                <th>消息</th>
                                <th style="width: 50%;">操作</th>
                            </tr>
                        </thead>
                        <tbody>
                            {volist name="reject_list" id="r"}
                            <tr>
                                <td>{$r.usr_name}拒绝加入“{$r.prj_name}”项目</td>

                                <td><button onclick="window.location.href='{:url('index/rejectJoiningPrjResponse',array('flag'=>'DEL','prjId'=>$r.id))}'">删除消息</button></td>

                            </tr>
                            {/volist}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</body>

<style>
    body {
        background-image: url(__IMG__/消息背景.png);
    }
    
    .message_row {
        background-color: rgba(255, 255, 255, 0.336);
        padding: 20px;
    }
    
    .message_left {
        background-color: #f9f9f9c9;
        height: 100%;
        opacity: 0.9;
        font-size: medium;
    }
    
    .message_left_down {
        display: block;
    }
    
    @media (min-width: 990px) {
        .message_left_down {
            margin: 30px 10px;
        }
        .message_left {
            padding: 10px 25px;
        }
    }
    
    @media (max-width: 990px) {
        .message_left_down {
            margin: 30px 3px;
        }
        .message_left {
            padding: 10px 10px;
        }
    }
    
    .message_left_a {
        margin: 10px;
        display: block;
        color: #5e5d5d;
    }
    
    .message_top {
        color: #8d8c8c;
        height: 45px;
        font-size: medium;
        padding: 10px;
        margin-bottom: 10px;
        background-color: #fff;
        border-radius: 5px;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2), -2px 2px 6px rgba(0, 0, 0, 0.19);
    }
    
    .message_down {
        background-color: #fff;
        border-radius: 5px;
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.2), -2px 2px 6px rgba(0, 0, 0, 0.19);
    }
</style>

</html>